flutter demo （一）：居中的按钮

2023-01-28 13:33| 来源: 网络整理| 查看: 265

效果图：

代码如下：

import 'package:flutter/material.dart'; void main() => runApp(new MyApp()); class MyApp extends StatefulWidget { @override TestMyAppState createState() => new TestMyAppState(); } class TestMyAppState extends State { @override Widget build(BuildContext context) { final key = new GlobalKey(); return new MaterialApp( home: new Scaffold( key: key, appBar: new AppBar(title: new Text("test app")), body: new Container( alignment: Alignment.center, child: new Container( child: new RaisedButton( padding: new EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 10.0), //padding child: new Text( 'test', style: new TextStyle( fontSize: 18.0, //textsize color: Colors.white,// textcolor ), ), color: Theme.of(context).accentColor, elevation: 4.0, //shadow splashColor: Colors.blueGrey, onPressed: () { //click event: show a snack bar key.currentState.showSnackBar(new SnackBar( content: new Text('Hello!'), )); } ), )), ), ); } } 复制代码

目前flutter官方暂时未提供toast工具类，如果想弹出toast，可以利用第三方库fluttertoast：https://github.com/PonnamKarthik/FlutterToast 。目前其作者提交到官方仓库的最新版本是2.0.3: https://pub.dartlang.org/packages/fluttertoast 。

如何添加依赖? 找到项目中的 pubspec.yaml 文件,

name: layouts_flutter description: A new Flutter application. dependencies: flutter: sdk: flutter # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^0.1.0 fluttertoast: ^2.0.3 #添加到这里即可 dev_dependencies: flutter_test: sdk: flutter ... 复制代码

修改完点击右上角的"Packages get"即可。

显示toast的代码:

Fluttertoast.showToast( msg: "This is Center Short Toast", toastLength: Toast.LENGTH_SHORT, gravity: ToastGravity.BOTTOM, timeInSecForIos: 1 ); 复制代码

注意不要忘了添加import:

import 'package:fluttertoast/fluttertoast.dart'; 复制代码

【本文地址】

公司简介

联系我们